<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        
    </h:head>
    <h:body  style="background-color: background;">
        
        <h:form id="frmEvent">
            
                
            <p:panelGrid columns="8" style=" max-width: 85%;margin-top: 2%; margin-left: auto ; margin-right: auto;">
    
        <p:outputLabel value="Logged User: #{userBean.name}" />
        
        <p:commandLink  action="#{calendarBean.home()}" value="Home"/>
        <p:commandLink  action="#{calendarBean.invitation()}" value="invitation"/>
        <p:commandLink  action="#{calendarBean.notification()}" value="notification"/>
        <p:commandLink  action="#{calendarBean.favorite()}" value="favorite"/>
        
        <h:panelGrid columns="3" style="max-width: fit-content" >
            <h:outputLabel for="searchUsr" value="Search User: " />
            <p:autoComplete id="autoUser" value="#{autoCompleteUsers.searched}" completeMethod="#{autoCompleteUsers.completeText}" forceSelection="true"/>
            <p:commandButton id="cmdSubmit" value="Submit" icon="ui-icon-check" action="#{autoCompleteUsers.visitUser}" update="messages" />
        </h:panelGrid>
        
        <h:panelGrid columns="3" style="max-width: fit-content">
            <h:outputLabel for="searchEvt" value="Search Event: " />
            <p:autoComplete id="autoEvent" value="#{autoCompleteEvent.searched}" completeMethod="#{autoCompleteEvent.completeText}" forceSelection="true"/>
            <p:commandButton id="cmdSubmitEvent" value="Submit" icon="ui-icon-check" action="#{autoCompleteEvent.visitEvent}" update="messages" />
        </h:panelGrid>
        
        <p:commandLink  action="#{loginBean.logout()}" value="logout"/>
    </p:panelGrid>
            
            <p:messages id="messages" autoUpdate="true" globalOnly="true" showDetail="true" />
    
            <h:panelGrid columns="2" rendered="#{eventBean.okFlag}" style=" width: 80%;margin-top: 5%; margin-left: auto; margin-right: auto;">
      <p:panelGrid columns="2"   style="width: 70%;margin-top:4%; margin-left: auto; margin-right: auto;">
                
                    <p:outputLabel value="Title:"/>
                    <p:outputLabel value="#{eventBean.event.title}" />
                    
                    <p:outputLabel value="Place"/>
                    <p:outputLabel value="#{eventBean.event.place}"/>
                    
                    <p:outputLabel value="Creator:"/>
                    <p:outputLabel value="#{eventBean.event.creator.email}"/>
                    
                    <p:outputLabel value="From:"/>
                    <p:outputLabel value="#{eventBean.event.startTime.time}"/>
                    
                    <p:outputLabel value="To:"/>
                    <p:outputLabel value="#{eventBean.event.endTime.time}"/>
                    
                    <p:outputLabel value="Outdoor: "/>
                    <h:selectBooleanCheckbox id="privateCal" readonly="true" disabled="true" value="#{eventBean.event.outdoor}" style="text-align: center" />

                    <p:outputLabel value="Forecast: "/>
                    <p:outputLabel value="#{eventBean.weather}"/> 
                    
                    
                </p:panelGrid>
          <h:panelGrid style="height: 100%; width: 90%">
              <p:dataList value="#{eventBean.users}" style="width: 100%;" var="par" itemType="none" paginator="true" rows="10" styleClass="paginated">
                <f:facet name="header">
                    Participants
                </f:facet>
                  <p:commandLink action="#{eventBean.visitUser()}" title="Visit User" styleClass="ui-icon ui-icon-search" style="float:left;margin-right:10px">
                    <f:setPropertyActionListener value="#{par}" target="#{eventBean.selectedUser}" />
                    <h:outputText value="#{par.email}" />
                </p:commandLink>
                  <h:outputText value="#{par.nameSurnameString()}" style="display:inline-block"/>
              </p:dataList>
          </h:panelGrid>
                
      </h:panelGrid>
    
    </h:form>
    </h:body>
</html>
